<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<!DOCTYPE html>
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <title>蓝源Eloan-P2P平台</title>
    <link rel="stylesheet" href="css/bootstrap.min.css" type="text/css">
    <link rel="stylesheet" href="css/core.css" type="text/css">

    <script type="text/javascript" src="js/jquery-1.12.4.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/jquery.bootstrap.min.js"></script>
    <script type="text/javascript" src="js/jquery.flipcountdown.js"></script>
    <style type="text/css">
        .el-userhead{
            width: 100px;
            height: 100px;
            display: block;
            margin: 0px auto;
        }
        .muted{
            color: #999;
        }
        .text-info{
            color: #09d;
        }
    </style>

    
</head>
<body>
<!-- 网页顶部导航 -->
<div class="el-header">
    <div class="container" style="position: relative;">
        <ul class="nav navbar-nav navbar-right">
            <li><a href="index.do">首页</a></li>
            <li>
                <a class="el-current-user" href="personal.do">yexing</a>
            </li>
            <li><a href="recharge.do">账户充值  </a></li>
            <li><a href="logout.do">注销 </a></li>
            <li><a href="borrow_info.do?id=9#">帮助</a></li>
        </ul>
    </div>
</div>

<!-- 网页导航 -->
<div class="navbar navbar-default el-navbar">
    <div class="container">
        <div class="navbar-header">
            <a href="">
                <img alt="Brand" src="img/logo.png">
            </a>
        </div>
        <ul class="nav navbar-nav">
            <li id="index"><a href="index.do">首页</a></li>
            <li id="invest" class="active"><a href="invest.do">我要投资</a></li>
            <li id="borrow"><a href="borrow.do">我要借款</a></li>
            <li id="personal"><a href="personal.do">个人中心</a></li>
            <li><a href="borrow_info.do?id=9#">新手指引</a></li>
            <li><a href="borrow_info.do?id=9#">关于我们</a></li>
        </ul>
    </div>
</div>

<script type="text/javascript">
    $("#"+"invest").addClass("active");
</script>

<div class="container" style="margin-top: 10px;">

    <div class="row">
        <div class="col-sm-3">
            <div class="panel panel-default">
                <div class="panel-heading">
                    借款人
                </div>
                <div class="panel-body">
                    <img class="el-userhead" src="img/person_icon.png">
                    <p class="text-center">
                        <a class="text-info" href="borrow_info.do?id=9#">${username}</a>
                    </p><br>
                    <div>
                        籍贯： 湖南 - 长沙
                    </div>
                    <div>
                        认证信息：
                        <label class="label label-success">
                            <span class="glyphicon ">通过</span> <!--glyphicon-user-->
                            <span class="glyphicon "></span> <!--glyphicon-eye-open-->
                        </label>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-sm-6">
            <h3 class="text-info" style="margin-top: 0px;">
                ${title}
                <small> <label class="label label-primary">信</label></small>
            </h3>
            <div>
                <table width="100%" height="250px">
                    <tbody><tr>
                        <td class="muted" width="80px">借款金额</td>
                        <td class="text-info" width="120px" style="padding-left: 10px;">
                            ${bidrequestAmount}
                        </td>
                        <td class="muted" width="80px">年化利率</td>
                        <td class="text-info" style="padding-left: 10px;">
                            10%
                        </td>
                    </tr>
                    <tr>
                        <td class="muted ">借款期限</td>
                        <td class="text-info" style="padding-left: 10px;">
                            ${deadTime}
                        </td>
                        <td class="muted">总可得利息</td>
                        <td class="text-info" style="padding-left: 10px;">
                            250.001
                        </td>
                    </tr>
                    <tr>
                        <td class="muted">还款方式</td>
                        <td class="text-info" style="padding-left: 10px;">
                         <c:if test="${returntype==0}">
                         	等额本息
                         </c:if>   
                         <c:if test="${returntype==1}">
                             每月还利息
                         </c:if>  
                        </td>
                        <td class="muted">最小投标</td>
                        <td class="text-info" style="padding-left: 10px;">
                            ${availableAmount}
                        </td>
                    </tr>
                    <tr>
                        <td class="muted">风控意见</td>
                        <td class="text-info" style="padding-left: 10px;" colspan="3">
								多投点 赚得多
                        </td>
                    </tr>
                    <tr>
                        <td class="muted">剩余时间</td>
                        <td class="text-info" style="padding-left: 10px;" colspan="3">
                            ${disabledays}
                            <div id="retroclockbox" class="xdsoft">
	                            <div class="xdsoft_flipcountdown xdsoft_size_xs">
		                            <div class="xdsoft_digit" style="background-position: 0px -145px;"></div>
		                            <div class="xdsoft_digit" style="background-position: 0px -145px;"></div>
		                            <div class="xdsoft_digit xdsoft_space"></div>
		                            <div class="xdsoft_digit" style="background-position: 0px -145px;"></div>
		                            <div class="xdsoft_digit" style="background-position: 0px -145px;"></div>
		                            <div class="xdsoft_digit xdsoft_space"></div>
		                            <div class="xdsoft_digit" style="background-position: 0px -145px;"></div>
		                            <div class="xdsoft_digit" style="background-position: 0px -145px;"></div>
		                            <div class="xdsoft_digit xdsoft_space"></div><div class="xdsoft_digit" style="background-position: 0px -145px;"></div>
		                            <div class="xdsoft_digit" style="background-position: 0px -145px;"></div><div class="xdsoft_clearex"></div>
		                        </div>
                            </div>
                        </td>
                    </tr>
                    </tbody></table>
            </div>
        </div>
        <div class="col-sm-3">
            <table style="height:110px;width:230px;">
                <tbody><tr>
                    <td class="muted">投标总数</td><td class="text-info" style="padding-left: 10px;">
                    ${bidcount}
                </td>
                </tr>
                <tr>
                    <td class="muted">还需金额</td>
                    <td class="text-info" style="padding-left: 10px;">
                   ${needAmount}  
                	</td>
                </tr>
                <tr>
                    <td class="muted" colspan="2">投标进度</td>
                </tr>
                <tr>
                    <td colspan="2">
                        <div style="margin-bottom: 10px;" class="progress">
                            <div style="width: 0" class="progress-bar progress-bar-info progress-bar-striped"></div>
                        </div>
                    </td>
                </tr>
                </tbody></table>

            <input id="usableAmount" autocomplete="off" value="${useableAmount}" type="hidden" />
            <input id="minBidAmount" autocomplete="off" value="${availableAmount}" type="hidden"/>
            <input id="maxBidAmount" autocomplete="off" value="${needAmount}" type="hidden"/>

            <table id="redtable" style="height:100px;width:180px;">
                <tbody><tr>
                    <td class="muted">可用余额</td>
                    <td>
                        <span class="text-info">
                           <%-- ${useableAmount}--%>
                            100W
                        </span>
                    </td>
                </tr>
                <tr>
                    <td class="muted">已投</td>
                    <td>
						${currentsum}  
                    </td>
                </tr>
                <tr>
                    <td class="muted">还需要</td>
                    <td>
                        <span id="needs" class="text-info">
                            ${needAmount}

                        </span>
                    </td>
                </tr>
                <tr>
                    <td colspan="2">
                        <div class="form-group">
                            <input class="form-control input-sm" id="amount" autocomplete="off" placeholder="投资金额">
                        </div>
                    </td>
                </tr>
                </tbody></table>
            <button id="bidBtn" class="btn btn-danger  btn-block">
                马上投标
            </button>

        </div>
    </div>

    <div class="panel panel-default">
        <div class="panel-heading">
            借款人信息
        </div>
        <div class="panel-body">
            <table>
                <tbody>
                <tr>
                    <td class="muted text-right" width="140px;">出生时间</td>
                    <td width="150px;" style="padding-left: 10px;" class="text-info">
                        2019-12-18
                    </td>
                    <td class="muted text-right" width="140px;">借款额度</td>
                    <td width="150px;" style="padding-left: 10px;" class="text-info">
                        5,000
                    </td>
                    <td class="muted text-right" width="140px;">性别</td>
                    <td width="150px;" style="padding-left: 10px;" class="text-info">
                        男
                    </td>
                    <td class="muted text-right" width="140px;">住房条件</td>
                    <td width="150px;" style="padding-left: 10px;" class="text-info">
                        有自有房
                    </td>
                </tr>
                <tr>
                    <td class="muted text-right">文化程度</td>
                    <td style="padding-left: 10px;" class="text-info">
                        大专以下
                    </td>
                    <td class="muted text-right">每月收入</td>
                    <td style="padding-left: 10px;" class="text-info">
                        3000以下
                    </td>
                    <td class="muted text-right">婚姻情况</td>
                    <td style="padding-left: 10px;" class="text-info">
                        已婚
                    </td>
                    <td class="muted text-right">子女情况</td>
                    <td style="padding-left: 10px;" class="text-info">
                        有子女
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>

    <div class="panel panel-default">
        <div class="panel-heading">
            <div style="font-size: 16px;">材料信息</div>
        </div>
        <div class="panel-body">
            <table class="table table-striped">
                <thead>
                <tr>
                    <th>材料类型</th>
                    <th>材料数量</th>
                </tr>
                </thead>
                <tbody>
                <tr style="cursor: pointer;" lid="2101" st="1" class="more">
                    <th>房产证反面</th>
                    <td>1</td>
                </tr>
                <tr style="cursor: pointer;" lid="2101" st="1" class="more">
                    <th>户口本</th>
                    <td>1</td>
                </tr>
                <tr style="cursor: pointer;" lid="2101" st="1" class="more">
                    <th>房产证正面</th>
                    <td>1</td>
                </tr>
                <tr style="cursor: pointer;" lid="2101" st="1" class="more">
                    <th>电话记录</th>
                    <td>1</td>
                </tr>
                <tr style="cursor: pointer;" lid="2101" st="1" class="more">
                    <th>毕业证</th>
                    <td>1</td>
                </tr>
                <tr style="cursor: pointer;" lid="2101" st="1" class="more">
                    <th>学位证</th>
                    <td>1</td>
                </tr>
                <tr style="cursor: pointer;" lid="2101" st="1" class="more">
                    <th>房产证正面</th>
                    <td>1</td>
                </tr>
                <tr style="cursor: pointer;" lid="2101" st="1" class="more">
                    <th>房产证正面</th>
                    <td>1</td>
                </tr>
                <tr style="cursor: pointer;" lid="2101" st="1" class="more">
                    <th>房产证正面</th>
                    <td>1</td>
                </tr>
                <tr style="cursor: pointer;" lid="2101" st="1" class="more">
                    <th>房产证正面</th>
                    <td>1</td>
                </tr>
                <tr style="cursor: pointer;" lid="2101" st="1" class="more">
                    <th>房产证正面</th>
                    <td>1</td>
                </tr>
                <tr style="cursor: pointer;" lid="2101" st="1" class="more">
                    <th>房产证正面</th>
                    <td>1</td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>

    <div class="panel panel-default">
        <div class="panel-heading">
            <div style="font-size: 16px;">还款情况</div>
        </div>
        <div class="panel-body">
            <table class="table table-striped">
                <thead>
                <tr>
                    <th>还款状态</th>
                    <th>最近一周</th>
                    <th>最近1月</th>
                    <th>最近6月</th>
                    <th>6个月前</th>
                    <th>总计[?]</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>提前还款</td>
                    <td>0</td>
                    <td>0</td>
                    <td>0</td>
                    <td>0</td>
                    <td>0</td>
                </tr>
                <tr>
                    <td>准时还款</td>
                    <td>0</td>
                    <td>0</td>
                    <td>0</td>
                    <td>0</td>
                    <td>0</td>
                </tr>
                <tr>
                    <td>逾期已还</td>
                    <td>0</td>
                    <td>0</td>
                    <td>0</td>
                    <td>0</td>
                    <td>0</td>
                </tr>
                <tr>
                    <td>逾期未还</td>
                    <td>0</td>
                    <td>0</td>
                    <td>0</td>
                    <td>0</td>
                    <td>0</td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
    <div class="panel panel-default">
        <div class="panel-heading">
            <div style="font-size: 16px;">投标记录</div>
        </div>
        <div class="panel-body">
            <table class="table table-striped">
                <thead>
                <tr>
                    <th>投标人</th>
                    <th>年利率 </th>
                    <th>有效金额(¥)</th>
                    <th>投标时间</th>
                    <th>类型</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td colspan="6">
                        <p class="text-primary text-center">暂时没有投标数据</p>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>

<div class="container-foot-2">
    <div class="context">
        <div class="left">
            <p>版权所有： 广州xxx科技有限公司</p>
            <p>地  址： 广州市天河区棠下荷光三横路盛达商务园D座5楼</p>
            <p>电  话： 020-29007520  
                邮箱： service@520it.com</p>
            <p>
                <a href="http://www.miitbeian.gov.cn/" style="color: #ffffff">ICP备案
                    ：粤ICP备字1504547</a>
            </p>
            <p>
                <a href="http://www.gzjd.gov.cn/wlaqjc/open/validateSite.do" style="color: #ffffff">穗公网安备：44010650010086</a>
            </p>
        </div>
        <div class="right">
            <a target="_blank" href="http://weibo.com/ITxiaomage"><img src="img/sina.png"></a>
        </div>
        <div class="clearfix"></div>
    </div>
</div>
</body>

<script type="text/javascript">
        $(function(){
            $("#retroclockbox").flipcountdown({
                size:'xs',
                beforeDateTime:"12/06/2019 16:58:12"
            });

           var need = "${needAmount}";
            console.info(need);
            if(need <= 0){
               $('#redtable').css("display","none");
               $('#bidBtn').css("display","none");
            }
            //$("#amount").val()
                $("#bidBtn").on("click",function(){
                var amount = parseFloat("${needAmount}");
                if(!amount){
                    $.messager.popup("请输入投资金额");
                    return;
                }
                if(parseFloat($("#usableAmount").val())<amount){
                    $.messager.popup("投资金额已超过账户余额");
                    return;
                }
                if(parseFloat($("#minBidAmount").val())>amount){
                    $.messager.popup("投资金额低于最小投标金额");
                    return;
                }
                if(parseFloat($("#maxBidAmount").val())<amount){
                    $.messager.popup("投资金额已超过借款标金额");
                    return;
                }
                $.post("/borrow_bid/{}",{
                    bidRequestId : 9,
                    amount:amount
                },function(data){
                    if(data.success){
                        $.messager.popup("恭喜你,投标成功");
                        location.reload();
                    }else{
                        $.messager.popup(data.message);
                    }
                });
            });
        });
    </script>
</html>